﻿<div class="sWidgets" align="center">
    <div class="sWidget">
        <div class="sparkContainer">
            <span>Unique visitors</span>
            <div class="sparklineBar"></div>
        </div>
        <span><a href="#">5.342 <i>unique visitors</i></a></span>
    </div>
    <div class="sWidget">
        <div class="sparkContainer">
            <span><a href="#">Monthly sales</a></span>
            <div class="sparklineBar02"></div>
        </div>
        <span>$13.345,32 <i>earned</i></span>
    </div>
    <div class="sWidget">
        <div class="sparkContainer">
            <span>Registrations</span>
            <div class="sparklineBar03"></div>
        </div>
        <span><a href="#">2.131 <i>new users</i></a></span>
    </div>
</div>

<div class="divider"><div><span></span></div></div>

<div class="row-fluid">
    <div class="span7">
        <div class="widget">
            <div class="tabbable">
                <div class="wTitle">
                    <div class="wIcon">
                        <img src="/content/images/icons/14x14/volume4.png" alt="">
                    </div>
                    <h5>Dashboard chart</h5>
                    <ul class="nav nav-tabs pull-right" id="dashboard-demo">
                        <li class="active"><a data-toggle="tab" data-target="#chart01" href="#chart01">Revenue</a></li>
                        <li><a data-toggle="tab" data-target="#chart02" href="#chart02">Users</a></li>
                        <li><a data-toggle="tab" data-target="#chart03" href="#chart03">Live</a></li>
                    </ul>
                    <ul class="titleButtons">
                        <li rel="tipsyS" title="Generating report..."><img src="/content/images/ajaxLoader/14x14/loader01.gif" alt=""></li>
                        <li class="dropdown">
                            <a rel="tipsyS" title="Options" class="dropdown-toggle" data-toggle="dropdown" href="#"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            <ul class="dropdown-menu pull-right">
                                <li><a href="#"><img src="/content/images/icons/14x14/download4.png" alt=""> Download statistic</a></li>
                                <li><a href="#"><img src="/content/images/icons/14x14/plus.png" alt=""> Make new report</a></li>
                                <li class="last-child"><a href="#"><img src="/content/images/icons/14x14/trash.png" alt=""> Delete all</a></li>
                            </ul>
                        </li>
                        <li><a rel="tipsyS" title="Print statistic" href="#"><img src="/content/images/icons/14x14/printer2.png" alt=""></a></li>
                    </ul>
                </div>

                <div class="wContent">
                    <div class="wContentInner">
                        <div class="tab-content">
                            <div class="tab-pane active" id="chart01">
                                <div class="analytic">
                                    <div class="chart" id="demoCharts01"></div>
                                </div>
                            </div>
                            <div class="tab-pane" id="chart02">
                                <div class="analytic">
                                    <div class="chart" id="demoCharts02"></div>
                                </div>
                            </div>

                            <div class="tab-pane" id="chart03">
                                <div class="analytic">
                                    <div class="chart" id="demoCharts03"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="span5">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/member2.png" alt="">
                </div>
                <h5>Stuff members <span>(using scrollbar plugin)</span></h5>
            </div>

            <div class="wContent">
                <div class="memberScroll">
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Freddy Adams</a><br> <span>Web administrator</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bOlive">Online</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Olivia James</a><br> <span>Sales manager</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bAutumn">Away</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Mark Johan</a><br> <span>Web designer</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bMuddy">Offline</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Bernad Delic</a><br> <span>Director</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bMuddy">Offline</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Joshua Liebz</a><br> <span>Web designer</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bOlive">Online</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Antony Mark</a><br> <span>Web moderator</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bMuddy">Offline</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Selena Smith</a><br> <span>Web designer</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bOlive">Online</span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="memberList">
                        <a class="profileImage" href="#">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </a>
                        <h5><a href="#">Maria Smith</a><br> <span>Web moderator</span></h5>
                        <div class="doActions">
                            <div class="btn-group ctrlGroup">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                            </div>
                        </div>
                        <span class="label bOlive">Online</span>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span12">
        <div class="widget">
            <div class="wTitle">
                <h5>Gallery with options</h5>
            </div>

            <div class="wContent">
                <div class="wContentHeader noSearch">
                    <select class="chosen">
                        <option>Choose gallery</option>
                        <option>Option one</option>
                        <option>Option two</option>
                        <option>Option three</option>
                    </select>

                    <div class="inline checkPlus fRight">
                        <a href="#" class="button sButton bAutumn">Some action</a>
                    </div>
                </div>
                <div class="wContentInner" align="center">
                    <ul class="thumbs" align="center">
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li class="item users isotope-item">
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li class="item users isotope-item">
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li class="item users isotope-item">
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li class="item users isotope-item">
                            <a href="#"><img src="/content/upload/201311/preview02.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview02.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                        <li>
                            <a href="#"><img src="/content/upload/201311/preview01.jpg" alt=""></a>
                            <div class="actions" align="center">
                                <div class="actionsContainer">
                                    <a href="#" class="ctrlButton removeImage"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                    <a class="ctrlButton fancybox" rel="group" href="/content/upload/201311/preview01.jpg"><img src="/content/images/icons/14x14/magnifier.png" alt=""></a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="wContentFooter" align="left">
                    <label for="file" class="formButton"><input class="allImages" type="checkbox"> Select all images</label>
                    <a href="#" class="button sButton bMuddy">Delete selected images</a>
                    <div class="fRight noSearch clearfix hidden-phone hidden-tablet">
                        <label for="file" class="inline">Upload image:</label>
                        <div class="inline">
                            <input type="file" id="file" name="file">
                        </div>
                        <a href="#" class="button noShadow sButton bAtina">Start upload</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span6">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/list.png" alt="">
                </div>
                <h5>To do list <span>(using antiscroll plugin)</span></h5>
            </div>

            <div class="wContent">
                <div class="box-wrap antiscroll-wrap">
                    <div class="box">
                        <div class="antiscroll-inner">
                            <ul>
                                <li class="doListHeader">
                                    <div class="dateExp">Expire date</div>
                                    <div class="doTitle">Task title</div>
                                    <div class="actionTitle">Actions</div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#12643</span>
                                        <i><strong>21 Jan 2013</strong></i>
                                    </div>
                                    <div class="doTitle">
                                        <h5><strong>Publish template</strong></h5>
                                        <span class="label bMuddy">Important</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Preview" class="ctrlButton"><img src="/content/images/icons/14x14/box2.png" alt=""></a>
                                    </div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#12647</span>
                                        <i>23Dec 2012</i>
                                    </div>
                                    <div class="doTitle">
                                        <h5>Check disk space</h5>
                                        <span class="label bAutumn">In progress</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                    </div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#13121</span>
                                        <i>14 Dec 2012</i>
                                    </div>
                                    <div class="doTitle">
                                        <h5 class="done">Ship orders</h5>
                                        <span class="label bOlive">Finished</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                    </div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#12625</span>
                                        <i>05 Nov 2012</i>
                                    </div>
                                    <div class="doTitle">
                                        <h5 class="done">Publish idea</h5>
                                        <span class="label bOlive">Finished</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                    </div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#13513</span>
                                        <i>17 Sep 2012</i>
                                    </div>
                                    <div class="doTitle">
                                        <h5 class="done">Make design</h5>
                                        <span class="label bOlive">Finished</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                    </div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#11153</span>
                                        <i>19 Aug 2012</i>
                                    </div>
                                    <div class="doTitle">
                                        <h5 class="done">Get idea</h5>
                                        <span class="label bOlive">Finished</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                    </div>
                                </li>
                                <li class="doList">
                                    <div class="dateExp">
                                        <span>#15874</span>
                                        <i>09 July 2012</i>
                                    </div>
                                    <div class="doTitle">
                                        <h5 class="done">Imagine template</h5>
                                        <span class="label bOlive">Finished</span>
                                    </div>
                                    <div class="doActions">
                                        <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                        <a href="#" rel="tipsyS" title="Options" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="span6">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/box2.png" alt="">
                </div>
                <h5>Monthly report <span>(without plugins)</span></h5>
            </div>

            <div class="wContent">
                <ul>
                    <li class="reportHeader">
                        <div class="reportID">ID number</div>
                        <div class="reportMonth">Report date</div>
                        <div class="actionTitle">Actions</div>
                    </li>
                    <li class="reportWidget">
                        <div class="reportID">
                            <span><strong>#12643</strong></span>
                        </div>
                        <div class="reportMonth">
                            <h5><strong>January 2013</strong> <span>(01.01.13 - 31.01.13)</span></h5>
                        </div>
                        <div class="doActions">
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/download4.png" alt=""></a>
                        </div>
                    </li>
                    <li class="reportWidget">
                        <div class="reportID">
                            <span>#12647</span>
                        </div>
                        <div class="reportMonth">
                            <h5>December 2012 <span>(01.12.12 - 31.12.12)</span></h5>
                        </div>
                        <div class="doActions">
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/download4.png" alt=""></a>
                        </div>
                    </li>
                    <li class="reportWidget">
                        <div class="reportID">
                            <span>#13121</span>
                        </div>
                        <div class="reportMonth">
                            <h5>November 2012 <span>(01.11.12 - 30.11.12)</span></h5>
                        </div>
                        <div class="doActions">
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/download4.png" alt=""></a>
                        </div>
                    </li>
                    <li class="reportWidget">
                        <div class="reportID">
                            <span>#12711</span>
                        </div>
                        <div class="reportMonth">
                            <h5>September 2012 <span>(01.10.12 - 31.10.12)</span></h5>
                        </div>
                        <div class="doActions">
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/download4.png" alt=""></a>
                        </div>
                    </li>
                </ul>
                <div class="wContentFooter" align="right">
                    <a href="#" class="button sButton bAtina">View all tasks</a>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span12">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/list.png" alt="">
                </div>
                <h5>Media table</h5>
            </div>

            <div class="wContent">
                <table cellpading="0" cellspacing="0" width="100%" class="dTable mediaTable">
                    <thead>
                        <tr>
                            <th align="center" width="40">Image</th>
                            <th align="left" width="550">Username and email</th>
                            <th align="center">Role</th>
                            <th align="center">R. date</th>
                            <th align="center" style="min-width: 80px;" align="middle">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td align="center"><img class="avatar" src="/content/upload/201311/preview02.jpg" alt=""></td>
                            <td align="left"><strong>admin</strong> (admin@example.com)</td>
                            <td align="center">Premium</td>
                            <td align="center">21.12.2012</td>
                            <td align="center">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            </td>
                        </tr>
                        <tr>
                            <td align="center"><img class="avatar" src="/content/upload/201311/preview02.jpg" alt=""></td>
                            <td align="left"><strong>user323</strong> (user323@example.com)</td>
                            <td align="center">Exclusive</td>
                            <td align="center">13.10.2011</td>
                            <td align="center">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            </td>
                        </tr>
                        <tr>
                            <td align="center"><img class="avatar" src="/content/upload/201311/preview02.jpg" alt=""></td>
                            <td align="left"><strong>guest</strong> (guest@example.com) <span class="hidden-phone hidden-tablet" rel="tipsyS" title="Susspended untill 21 February 2013" class="label bMuddy">susspended</span></td>
                            <td align="center">Normal</td>
                            <td align="center">15.12.2008</td>
                            <td align="center">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            </td>
                        </tr>
                        <tr>
                            <td align="center"><img class="avatar" src="/content/upload/201311/preview02.jpg" alt=""></td>
                            <td align="left"><strong>hell232</strong> (hell232@example.com)</td>
                            <td align="center">Premium</td>
                            <td align="center">18.07.2007</td>
                            <td align="center">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            </td>
                        </tr>
                        <tr>
                            <td align="center"><img class="avatar" src="/content/upload/201311/preview02.jpg" alt=""></td>
                            <td align="left"><strong>admin</strong> (admin@example.com)</td>
                            <td align="center">Premium</td>
                            <td align="center">21.12.2012</td>
                            <td align="center">
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/cog2.png" alt=""></a>
                                <a href="#" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span12">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/envlope1.png" alt="">
                </div>
                <h5>WYSIWYG HTML Editor</h5>
            </div>
            <div class="wContent">
                <textarea class="cleditor" name="input"></textarea>
            </div>
        </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span6">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/calendar.png" alt="">
                </div>
                <h5>Dashboard calendar</h5>
            </div>

            <div class="wContent">
                <div id="calendar"></div>
            </div>
        </div>
    </div>

    <div class="span6">
        <div class="widget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/member2.png" alt="">
                </div>
                <h5>Users with adress lines</h5>
            </div>

            <div class="wContent">
                <div class="adressScroll">
                    <div class="formField">
                        <div class="adressAvatar">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </div>
                        <div class="adressField">
                            <address>
                                <strong>Twitter, Inc.</strong><br>
                                795 Folsom Ave, Suite 600<br>
                                San Francisco, CA 94107<br>
                                <abbr title="Phone">P:</abbr> (123) 456-7890
                            </address>

                            <address>
                                <strong>Full Name</strong><br>
                                <a href="mailto:#">first.last@example.com</a>
                            </address>
                        </div>
                        <div class="doActions fRight" align="right">
                            <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" rel="tipsyS" title="Open profile" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            <div>
                                <span class="label bOlive">User online</span>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="formField">
                        <div class="adressAvatar">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </div>
                        <div class="adressField">
                            <address>
                                <strong>Twitter, Inc.</strong><br>
                                795 Folsom Ave, Suite 600<br>
                                San Francisco, CA 94107<br>
                                <abbr title="Phone">P:</abbr> (123) 456-7890
                            </address>

                            <address>
                                <strong>Full Name</strong><br>
                                <a href="mailto:#">first.last@example.com</a>
                            </address>
                        </div>
                        <div class="doActions fRight" align="right">
                            <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" rel="tipsyS" title="Open profile" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            <div>
                                <span class="label bMuddy">User offline</span>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="formField">
                        <div class="adressAvatar">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </div>
                        <div class="adressField">
                            <address>
                                <strong>Twitter, Inc.</strong><br>
                                795 Folsom Ave, Suite 600<br>
                                San Francisco, CA 94107<br>
                                <abbr title="Phone">P:</abbr> (123) 456-7890
                            </address>

                            <address>
                                <strong>Full Name</strong><br>
                                <a href="mailto:#">first.last@example.com</a>
                            </address>
                        </div>
                        <div class="doActions fRight" align="right">
                            <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" rel="tipsyS" title="Open profile" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            <div>
                                <span class="label bMuddy">User offline</span>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="formField">
                        <div class="adressAvatar">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </div>
                        <div class="adressField">
                            <address>
                                <strong>Twitter, Inc.</strong><br>
                                795 Folsom Ave, Suite 600<br>
                                San Francisco, CA 94107<br>
                                <abbr title="Phone">P:</abbr> (123) 456-7890
                            </address>

                            <address>
                                <strong>Full Name</strong><br>
                                <a href="mailto:#">first.last@example.com</a>
                            </address>
                        </div>
                        <div class="doActions fRight" align="right">
                            <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" rel="tipsyS" title="Open profile" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            <div>
                                <span class="label bOlive">User online</span>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="formField">
                        <div class="adressAvatar">
                            <img src="/content/upload/201311/preview02.jpg" alt="">
                        </div>
                        <div class="adressField">
                            <address>
                                <strong>Twitter, Inc.</strong><br>
                                795 Folsom Ave, Suite 600<br>
                                San Francisco, CA 94107<br>
                                <abbr title="Phone">P:</abbr> (123) 456-7890
                            </address>

                            <address>
                                <strong>Full Name</strong><br>
                                <a href="mailto:#">first.last@example.com</a>
                            </address>
                        </div>
                        <div class="doActions fRight" align="right">
                            <a href="#" rel="tipsyS" title="Remove task" class="ctrlButton"><img src="/content/images/icons/14x14/trash.png" alt=""></a>
                            <a href="#" rel="tipsyS" title="Open profile" class="ctrlButton"><img src="/content/images/icons/14x14/member2.png" alt=""></a>
                            <div>
                                <span class="label bMuddy">User offline</span>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="row-fluid">
    <div class="span12">
        <div class="widget lastWidget">
            <div class="wTitle">
                <div class="wIcon">
                    <img src="/content/images/icons/14x14/envlope1.png" alt="">
                </div>
                <h5>Chat box <strong>(Adam Smith)</strong></h5>
            </div>
            <div class="wContent noPadding">
                <div class="chatField">
                    <div class="avatar">
                        <img src="/content/upload/201311/avatar.jpg" alt="">
                    </div>
                    <div class="message">
                        <span class="client"><a href="#">Adam Smith</a>, <i>12 December 2012, 21:43</i></span>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
                    </div>
                </div>
                <div class="chatField">
                    <div class="avatar">
                        <img src="/content/upload/201311/avatar.jpg" alt="">
                    </div>
                    <div class="message">
                        <span><strong>Administrator</strong>, <i>12 December 2012, 21:48</i></span>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                    </div>
                </div>
                <div class="chatField">
                    <div class="avatar">
                        <img src="/content/upload/201311/avatar.jpg" alt="">
                    </div>
                    <div class="message">
                        <span class="client"><a href="#">Adam Smith</a>, <i>12 December 2012, 22:03</i></span>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                    </div>
                </div>
                <div class="chatField">
                    <div class="avatar">
                        <img src="/content/upload/201311/avatar.jpg" alt="">
                    </div>
                    <div class="message">
                        <span class="client"><a href="#">Adam Smith</a>, <i>12 December 2012, 22:05</i></span>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
                    </div>
                </div>
                <div class="chatField">
                    <div class="avatar">
                        <img src="/content/upload/201311/avatar.jpg" alt="">
                    </div>
                    <div class="message">
                        <span><strong>Administrator</strong>, <i>12 December 2012, 22:05</i></span>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
                    </div>
                </div>
                <div class="chatField">
                    <div class="avatar">
                        <img src="/content/upload/201311/avatar.jpg" alt="">
                    </div>
                    <div class="message">
                        <span class="client"><a href="#">Adam Smith</a>, <i>12 December 2012, 22:13</i></span>
                        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.</p>
                    </div>
                </div>
                <div class="chatFooter">
                    <div class="row-fluid">
                        <div class="span10">
                            <input type="text" name="message" placeholder="Enter your message here...">
                        </div>
                        <div class="span2">
                            <a href="#" class="sendMessage button sButton bAtina blockButton">Send</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="divider"><div><span></span></div></div>

<div class="row-fluid">
    <div class="span4">
        <div class="widget">
            <div class="wTitle">
                <h5>UI HTML5 player</h5>
            </div>
            <div class="wContent" align="center">
                <!-- Player start -->
                <div id="jquery_jplayer_3" class="jp-jplayer"></div>
                <div id="jp_container_3" class="jp-audio">
                    <div class="jp-type-single">
                        <div class="jp-gui jp-interface">
                            <ul class="jp-controls">
                                <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
                                <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
                                <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
                                <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
                                <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
                                <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
                            </ul>
                            <ul class="jp-toggles">
                                <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
                                <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
                            </ul>
                            <div class="jp-progress">
                                <div class="jp-seek-bar">
                                    <div class="jp-play-bar"></div>

                                </div>
                            </div>
                            <div class="jp-volume-bar">
                                <div class="jp-volume-bar-value"></div>
                            </div>
                            <div class="jp-current-time"></div>
                            <div class="jp-duration"></div>
                        </div>
                        <div class="jp-title">
                            <ul>
                                <li>Cro Magnon Man</li>
                            </ul>
                        </div>
                        <div class="jp-no-solution">
                            <span>Update Required</span>
                            To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
                        </div>
                    </div>
                </div>
                <!-- Player end -->
            </div>
        </div>
    </div>

    <div class="span8">
        <div class="widget">
            <div class="wTitle">
                <h5>UI HTML5 player</h5>
            </div>
            <div class="wContent">
                <!-- Player start -->
                <div id="jp_container_2" class="jp-video jp-video-360p">
                    <div class="jp-type-single">
                        <div id="jquery_jplayer_2" class="jp-jplayer"></div>
                        <div class="jp-gui">
                            <div class="jp-video-play">
                                <a href="javascript:;" class="jp-video-play-icon" tabindex="1">play</a>
                            </div>
                            <div class="jp-interface">
                                <div class="jp-progress">
                                    <div class="jp-seek-bar">
                                        <div class="jp-play-bar"></div>
                                    </div>
                                </div>
                                <div class="jp-current-time"></div>
                                <div class="jp-duration"></div>
                                <div class="jp-title">
                                    <ul>
                                        <li>Incredibles Teaser</li>
                                    </ul>
                                </div>
                                <div class="jp-controls-holder">
                                    <ul class="jp-controls">
                                        <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
                                        <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
                                        <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
                                        <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
                                        <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
                                        <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
                                    </ul>
                                    <div class="jp-volume-bar">
                                        <div class="jp-volume-bar-value"></div>
                                    </div>

                                    <ul class="jp-toggles">
                                        <li><a href="javascript:;" class="jp-full-screen" tabindex="1" title="full screen">full screen</a></li>
                                        <li><a href="javascript:;" class="jp-restore-screen" tabindex="1" title="restore screen">restore screen</a></li>
                                        <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
                                        <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="jp-no-solution">
                            <span>Update Required</span>
                            To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
                        </div>
                    </div>
                </div>
                <!-- Player end -->
            </div>
        </div>
    </div>
</div>